<template>
  <div>
    <detail-header></detail-header>
    <detail-swiper :deData='detailData'></detail-swiper>
    <detail-container :deData='detailData'></detail-container>
    <detail-number :deData='detailData'></detail-number>
    <detail-tabs :deData='detailData'></detail-tabs>
    <detail-footer></detail-footer>
  </div>
</template>

<script>
import DetailHeader from './components/DetailHeader'
import DetailSwiper from './components/DetailSwiper'
import DetailContainer from './components/DetailContainer'
import DetailNumber from './components/DeatialNumber'
import DetailTabs from './components/DeatialTabs'
import DetailFooter from './components/DetailFooter'
import axios from 'axios'
export default {
  name: 'Detail',
  data() {
    return {
      detailData: []
    }
  },
  components: {
    DetailHeader,
    DetailSwiper,
    DetailContainer,
    DetailNumber,
    DetailTabs,
    DetailFooter
  },
  created() {
    var _this  = this;
    // 获取到页面地址栏的id
    var id = this.$route.query.id;
    // console.log('id:'+id);
    axios.get('/static/ceshi.json').then(res=> {
      var datas = res.data.data.home;
      // 拿到数据中的id
      // console.log(datas[0].id);
      for(var i=0; i< datas.length ;i++){
        // 通过地址栏的id和数据id是否匹配，匹配就将数据添加
        if(datas[i].id == id){
          _this.detailData.push(datas[i]);
        }
      }
    })

    // classify后半截数据：
    axios.get('/static/ceshi.json').then(function(res){
      // 获取
      var setLength = res.data.data.set
      // 遍历剩余的长度
      for(var i=0; i < setLength.length ; i++){
        if(id == setLength[i].id) {
          _this.detailData.push(setLength[i])
        }
      }
    })
  },
}
</script>

<style lang="less">
  *{
    box-sizing: border-box;
  }
</style>
